.bk-white{
  background-color: #fff;
}
.color-gray{
  color: #87888a;
}
.color-white{
  color: #fff;
}
.color-black{
  color: #000;
}
.color-empty{
  color:#c3c1c1
}
/* width */
.w14{
  width: 14px;
}
.w16{
  width: 16px;
}
.w18{
  width: 18px;
}
.w20{
  width: 20px;
}
.w22{
  width: 22px;
}
.w24{
  width: 24px;
}
.w26{
  width: 26px;
}
.w28{
  width: 28px;
}
.w30{
  width: 30px;
}
.w40{
  width: 40px;
}
.w50{
  width: 50px;
}
.w100{
  width: 100px;
}
.w110{
  width: 110px;
}
.w160{
  width: 160px;
}
.w200{
  width: 200px;
}
.w250{
  width: 250px;
}
.w300{
  width: 300px;
}
.w500{
  width: 500px;
}
.w10-ratio{
  width: 10%;
}
.w25-ratio{
  width: 25%;
}
.w-25{
  width: 25%;
}
.w-50{
  width: 50%;
}
/* height */
.h20{
  height: 20px;
}
.h22{
  height: 22px;
}
.h24{
  height: 24px;
}
.h26{
  height: 26px;
}
.h30{
  height: 30px;
}
.h40{
  height: 40px;
}
.h50{
  height: 50px;
}
.h80{
  height: 80px;
}
.h115{
  height: 115px;
}
.h130{
  height: 130px;
}
.h190{
  height: 190px;
}
.h200{
  height: 200px;
}
.h240{
  height: 240px;
}
.h300{
  height: 300px;
}
.h340{
  height: 340px;
}
.h350{
  height: 350px;
}
.h400{
  height: 400px;
}
.h50-ratio{
  width: 50%;
}
.calc-50{
  height: calc(100vh - 50px)
}
.calc-60{
  height: calc(100vh - 60px)
}


/* padding */
.p2{
  padding: 2px;
}
.p4{
  padding: 4px;
}
.p6{
  padding: 6px;
}
.p8{
  padding: 8px;
}
.p10{
  padding: 10px;
}
.p12{
  padding: 12px;
}
.pt4{
  padding-top: 4px;
}
.pt10{
  padding-top: 10px;
}
.pt40{
  padding-top: 40px;
}
.ptb4{
  padding: 4px 0px;
}
.pr10{
  padding-right: 10px;
}
.pb40{
  padding-bottom: 40px;
}
.ptb8{
  padding: 8px 0px;
}
.ptb10{
  padding: 10px 0px;
}
.prb8{
  padding: 0px 8px 8px 0;
}
.pl8{
  padding-left: 8px;
}
.pl10{
  padding-left: 10px;
}
.plr8{
  padding: 0 8px;
}
.plr20{
  padding: 0 20px;
}
.plr30{
  padding: 0 30px;
}
.plrt8{
  padding: 8px 8px 0px 8px;
}
.plt8{
  padding: 8px 0px 0px 8px;
}
.plt24-10{
  padding: 10px 24px;
}
.pt10-l30{
  padding: 10px 30px;
}

/* margin */
.m0{
  margin: 0px;
}
.m4{
  margin: 4px;
}
.m6{
  margin: 6px;
}
.m10{
  margin: 10px;
}
.mt2{
  margin-top: 2px;
}
.mt4{
  margin-top: 4px;
}
.mt6{
  margin-top: 6px;
}
.mt8{
  margin-top: 8px;
}
.mt10{
  margin-top: 10px;
}
.mt20{
  margin-top: 20px;
}
.mt30{
  margin-top: 30px;
}
.ml2{
  margin-left: 2px;
}
.ml4{
  margin-left: 4px;
}
.ml6{
  margin-left: 6px;
}
.ml10{
  margin-left: 10px;
}
.ml16{
  margin-left: 16px;
}
.ml19{
  margin-left: 19px;
}
.ml22{
  margin-left: 22px;
}
.ml24{
  margin-left: 24px;
}
.ml30{
  margin-left: 30px;
}
.ml54{
  margin-left: 54px;
}
.mr2 {
  margin-right: 2px;
}
.mr4 {
  margin-right: 4px;
}
.mr6 {
  margin-right: 6px;
}
.mr8 {
  margin-right: 8px;
}
.mr10 {
  margin-right: 10px;
}
.mr20 {
  margin-right: 20px;
}
.mr30 {
  margin-right: 30px;
}
.mr40 {
  margin-right: 40px;
}
.mr54 {
  margin-right: 54px;
}
.mb6 {
  margin-bottom: 6px;
}
.mb8 {
  margin-bottom: 8px;
}
.mb10 {
  margin-bottom: 10px;
}
.mb16 {
  margin-bottom: 16px;
}
.mb20 {
  margin-bottom: 16px;
}
.mb16 {
  margin-bottom: 16px;
}
.mb28 {
  margin-bottom: 28px;
}
.mtb10 {
  margin: 10px 0px;
}
.mlr10 {
  margin: 0px 10px;
}


/* display */
.flex{
  display: flex;
}
.flex-1{
  flex: 1;
}
.column{
  flex-direction: column;
}
.flex-center{
  justify-content: center;
}
.flex-end{
  justify-content: flex-end;
}
.flex-wrap{
  flex-wrap: wrap;
}
.space-between{
  justify-content: space-between;
}
.space-around{
  justify-content:space-around
}
.flex-end{
  justify-content: flex-end;
}
.align-items-baseline{
  align-items: baseline;
}
.align-items-center{
  align-items: center;
}
.display-block{
  display: block;
}
.align-centent-center{
  align-content: center;
}
.display-none{
  display: none;
}
/* fontSize */
.fs12{
  font-size: 12px;
}
.fs14{
  font-size: 14px;
}
.fs16{
  font-size: 16px;
}
.fs18{
  font-size: 18px;
}
.fs20{
  font-size: 20px;
}
.fs24{
  font-size: 24px;
}
.fs26{
  font-size: 26px;
}
.fs30{
  font-size: 30px;
}
/* font-weight */
.font-weight-400{
  font-weight:400;
}
/* border-radius */
.border-radius4{
  border-radius: 4px;
}
.border-radius6{
  border-radius: 6px;
}
.border-radius10{
  border-radius:10px;
}

/* font */
.bold{
  font-weight: bold;
}
.text-align-center{
  text-align: center;
}
.text-align-right{
  text-align: right;
}
/* fill */
.fill_blue{
  fill: #3377ff;
}
.fill_green{
  fill: #00d6b9;
}
.fill_orange{
  fill: #ff8800;
}
.fill_red{
  fill: #f74d4d;
}
.fill_purple{
  fill: #7c39ff;
}
.fill_gray{
  fill: lightgray
}
/* 单行文本 */
.ellipsis-one{
  width: 90%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 多行省略,未设置行数 */
.ellipsis-more{
  word-break: break-all;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
.line-2{
  -webkit-line-clamp: 2;
}
.line-3{
  -webkit-line-clamp: 3;
}
/* image */
.img-contain{
  object-fit: contain;
}
.opacity3{
  opacity: 0.3 !important;
}
/* mouse */
.pointer{
  cursor: pointer;
}
.pointer:hover{
  color: #3072ee;
}

.overflowY-auto{
  overflow-y: auto;
}
.relative{
  position: relative;
}
.absolute{
  position: absolute;
}

/* 滚动条 */
::-webkit-scrollbar-track {
  border-radius: 10px;
  box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
  -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.5);
  background-color: #c8c8c8;
}
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  background-color: #ffffff;
}

.color-picker {
  width: 254px !important;
}

.ant-tree-indent-unit{
  width:8px;
}


